<template>
  <div class="MailLabel">
    <header class="set-header">
      <span class="auto_title">签名列表</span>
      <el-button size="mini" type="primary" @click="edit('/mail/administration/sign/add',-1)">
        +新增签名
      </el-button>
    </header>
    <div class="gray"></div>
    <!-- 列表数据一-->
    <div class="list-show">
      <el-table :data="list" :height="$height - 230+'px'" stripe class="table">
        <el-table-column label="签名名称" prop="htmlName"></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button size="small" type="text" v-if="scope.row.isDefault" title="取消默认签名" @click="cancelSign(scope.row.id)">取消默认签名</el-button>
            <el-button size="small" type="text" @click="setDefault(scope.row.id)" v-else>设为默认签名</el-button>
            <el-button size="small" type="text" @click="edit('/mail/administration/sign/edit',scope.row)">编辑</el-button>
            <el-button size="small" type="text" @click="delRow(scope.row.id)" >删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
    import {query, del,cancelSign} from "@/api/mail/admin/mail-sign";
    export default {
        name: "MailSign",
        data() {
            return {
                list: [],
            }
        },
        mounted() {
            this.getData();
        },
        methods: {
            edit(path,row) {
                if(row==-1){
                    this.$router.push(path);
                }else{
                    this.$router.push({
                        path:path,
                        query:{
                            row:JSON.stringify(row)
                        }
                    })
                }
            },
            getData() {
                query({type: 1}).then(res => {
                    if(res.data.success){
                        this.list = res.data.data;
                    }
                }).catch(err => {
                    console.log(err)
                });
            },
            cancelSign(id) {
                this.$confirm("取消该默认签名?", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "success"
                }).then(() => {
                    cancelSign({id: id, enable: false}).then(res => {
                       this.dealEnd(res);
                    })
                }).catch(err => {
                    console.log(err)
                });

            },
            delRow(id) {
                this.$confirm("确定将选择数据删除?", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "success"
                }).then(() => {
                    del(id).then(res => {
                        this.$message({
                            type: "success",
                            message: res.data.msg
                        });
                        this.getData();
                    }).catch(err => {
                        console.log(err)
                    });
                })
            },
            dealEnd(res) {
                if(res.data.success){
                    this.$store.dispatch('set_sign');
                    this.dialogVisible = false;
                    this.$message({
                        type: "success",
                        message: res.data.msg
                    });
                    this.getData();
                }else{
                    this.$message({
                        type: "success",
                        message: res.data.msg
                    });
                }
            },
            setDefault(id) {
                this.$confirm("确定将选择数据设为默认签名?", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "success"
                }).then(() => {
                    cancelSign({id: id, enable: true}).then(res => {
                        this.dealEnd(res)
                    }).catch(err => {
                        console.log(err)
                    })
                })
            },
            //获取富文本内容
            getContent(content) {
                this.form.htmlContent = encodeURIComponent(content);
            }
        }
    }
</script>

<style scoped lang="scss">
  $activeColor: #2A97F9;
  .MailLabel {
    position: relative;
    .el-form{
      margin-top: 15px;
    }
    .list-show {
      margin: 20px 0 0 27px;
    }
    .add-btn {
      text-align: right;
      margin-bottom: 15px;
    }

  }
</style>
